Improved the apearance, behavior and consistency accross browsers of simple search.
authorTrevor Parscal <tparscal@users.mediawiki.org>
Thu, 16 Jul 2009 18:05:27 +0000 (18:05 +0000)
committerTrevor Parscal <tparscal@users.mediawiki.org>
Thu, 16 Jul 2009 18:05:27 +0000 (18:05 +0000)
skins/Vector.php
skins/vector/images/search.png
skins/vector/main-ltr.css
skins/vector/main-rtl.css

index f9f1c09..1094a26 100644 (file)
@@ -779,7 +779,7 @@ class VectorTemplate extends QuickTemplate {
                <?php if ( $wgVectorUseSimpleSearch ): ?>
                <div id="simpleSearch">
                        <input id="searchInput" name="search" type="text" <?php echo $this->skin->tooltipAndAccesskey( 'search' ); ?> <?php if( isset( $this->data['search'] ) ): ?> value="<?php $this->text( 'search' ) ?>"<?php endif; ?> />
-                       <input  id="searchButton" type='image' name='fulltext' src="<?php echo $wgStylePath ?>/vector/images/search.png" <?php echo $this->skin->tooltipAndAccesskey( 'search-fulltext' ); ?> align="top" />
+                       <input id="searchButton" type='submit' name='fulltext' value="&nbsp;" src="<?php echo $wgStylePath ?>/vector/images/search.png" <?php echo $this->skin->tooltipAndAccesskey( 'search-fulltext' ); ?> />
                </div>
                <?php else: ?>
                <input id="searchInput" name="search" type="text" <?php echo $this->skin->tooltipAndAccesskey( 'search' ); ?> <?php if( isset( $this->data['search'] ) ): ?> value="<?php $this->text( 'search' ) ?>"<?php endif; ?> />
index 665492f..6f21f42 100644 (file)
Binary files a/skins/vector/images/search.png and b/skins/vector/images/search.png differ
index de2f85d..9252ddb 100644 (file)
@@ -292,19 +292,38 @@ div#head h5 {
                margin: 0;
                margin-top: 0.4em;
        }
-       div#p-search div#simpleSearch input#searchInput {
-               margin-top: 0.33em;
+       div#p-search div#simpleSearch {
+               margin-top: 0.75em;
+               position: relative;
                border: solid 1px #AAAAAA;
-               height: 1.25em;
-               width: 10em;
-               padding: 0.33em;
+               background-color: white;
                background-image: url(images/search-fade.png);
-               background-repeat: repeat-x;
                background-position: top left;
+               background-repeat: repeat-x;
+       }
+       div#p-search div#simpleSearch input#searchInput {
+               margin: 0;
+               border-width: 0;
+               padding: 0.25em;
+               line-height: 1em;
+               font-size: 9.75pt;
+               width: 10em;
+               background-color: transparent;
        }
        div#p-search div#simpleSearch input#searchButton {
+               position: absolute;
+               top: 0;
+               right: 0;
+               margin: 0;
+               padding: 0;
+               width: 1.75em;
+               height: 100%;
                border: none;
-               margin-left: 0.25em;
+               cursor: pointer;
+               background-color: transparent;
+               background-image: url(images/search.png);
+               background-position: center center;
+               background-repeat: no-repeat;
        }
 /* Panel */
 div#panel {
index 9558c9c..472b51f 100644 (file)
@@ -292,19 +292,38 @@ div#head h5 {
                margin: 0;
                margin-top: 0.4em;
        }
-       div#p-search div#simpleSearch input#searchInput {
-               margin-top: 0.33em;
+       div#p-search div#simpleSearch {
+               margin-top: 0.75em;
+               position: relative;
                border: solid 1px #AAAAAA;
-               height: 1.25em;
-               width: 10em;
-               padding: 0.33em;
+               background-color: white;
                background-image: url(images/search-fade.png);
-               background-repeat: repeat-x;
                background-position: top right;
+               background-repeat: repeat-x;
+       }
+       div#p-search div#simpleSearch input#searchInput {
+               margin: 0;
+               border-width: 0;
+               padding: 0.25em;
+               line-height: 1em;
+               font-size: 9.75pt;
+               width: 10em;
+               background-color: transparent;
        }
        div#p-search div#simpleSearch input#searchButton {
+               position: absolute;
+               top: 0;
+               left: 0;
+               margin: 0;
+               padding: 0;
+               width: 1.75em;
+               height: 100%;
                border: none;
-               margin-right: 0.25em;
+               cursor: pointer;
+               background-color: transparent;
+               background-image: url(images/search.png);
+               background-position: center center;
+               background-repeat: no-repeat;
        }
 /* Panel */
 div#panel {